import React, { useEffect, useState } from 'react'
import { Button, Form, Input, Tree, Drawer,Radio } from 'antd';
import {addShopType} from "../apis/shop"
import qs from "querystring"


<<<<<<< HEAD
export default function AddshopType({ treedata,getTree }) {
=======
export default function AddshopType({ treedata,updata }) {
>>>>>>> 4baf4dd9148ff997549c6b069115f97a7a198f40
    //新增抽屉
    // eslint-disable-next-line react-hooks/rules-of-hooks
    const treeData = treedata
    // const [tre]

    const [open, setOpen] = useState(false);
    const [checkTree,setCheckTree] = useState([])
    const showDrawer = () => {
        setOpen(true);
    };
    const onClose = () => {
        setOpen(false);
    };

<<<<<<< HEAD
    const onFinish = (values) => {
        values.password=id
        console.log('Success:', values);
        getTree(values)
=======
    const onFinish = async(values) => {
        values.pid=checkTree
        console.log(values);
        const all = qs.stringify(values)
        await addShopType(all)
        onClose()
        updata(1)
       
>>>>>>> 4baf4dd9148ff997549c6b069115f97a7a198f40
    };
    const onFinishFailed = (errorInfo) => {
        // console.log('Failed:', errorInfo);
    };

    //树控件
    const [id, setId] = useState('')
    const onCheck = (checkedKeys, info) => {
<<<<<<< HEAD
        console.log(checkedKeys.checked[0]);
        setId(checkedKeys.checked[0])
    };
=======
        // console.log(checkedKeys.checked);
        setCheckTree(checkedKeys.checked[0])

    };
   
>>>>>>> 4baf4dd9148ff997549c6b069115f97a7a198f40
    return (
        <div>
            <Button type="primary" onClick={showDrawer}>
                新增
            </Button>
            <Drawer title="修改商品类型" placement="right" onClose={onClose} open={open}>
                <Form
                    name="basic"
                    labelCol={{
                        span: 8,
                    }}
                    wrapperCol={{
                        span: 16,
                    }}
                    initialValues={{
                        remember: true,
                    }}
                    onFinish={onFinish}
                    onFinishFailed={onFinishFailed}
                    autoComplete="off"
                >
                    <Form.Item
                        label="商品类型名称"
                        name="name"
                        rules={[
                            {
                                required: true,
                                message: '请输入商品类型名称',
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="状态"
                        name="status"
                        rules={[
                            {
                                required: true,
                                message: '请输入商品状态',
                            },
                        ]}
                    >
                        <Radio.Group>
                            <Radio value="1"> 启用 </Radio>
                            <Radio value="2"> 停用 </Radio>
                        </Radio.Group>
                    </Form.Item>

                    <Form.Item
                        label="上级商品类型"
                        name="pid"
                    >
                        <Tree
                            checkStrictly
                            checkable
                            // defaultExpandedKeys={}
                            // defaultCheckedKeys={}
                            onCheck={onCheck}
                            treeData={treeData}
                            checkStrictly
                        />
                    </Form.Item>


                    <Form.Item
                        wrapperCol={{
                            offset: 15,
                            span: 9,
                        }}
                    >
                        <div style={{ display: "flex", flexDirection: "row" }}>
                            <Button style={{ marginRight: "10px" }}>取消</Button>
                            <Button type="primary" htmlType="submit" style={{ marginRight: "10px" }}>
                                提交
                            </Button>
                        </div>

                    </Form.Item>
                </Form>
            </Drawer>
        </div>
    )
}
